<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>

<style>
    HTML,
    BODY {
        height: 100%;
    }
    BODY {
        background: -webkit-linear-gradient(top, crimson, orangered, gold, yellowgreen, steelblue, navy);
        background: linear-gradient(to bottom, crimson, orangered, gold, yellowgreen, steelblue, navy);
    }
    .bbmode {
        position: absolute;
        width: 50%;
        height: 100%;
        /*background: #000 url(/uploads/150301/eagle-fly.gif) no-repeat;*/
        background: #000 url(img/eagle-fly.gif) no-repeat;
        background-position: 50% 50%;
    }
    .bbmode--darken {
        mix-blend-mode: multiply;
    }
    .bbmode--lighten {
        right: 0;
        mix-blend-mode: lighten;
    }
</style>

<body>
<div class="bbmode bbmode--darken">
</div>

<div class="bbmode bbmode--lighten">
</div>
</body>
</html>